<template>
  <div id="app">
    <router-view/>
		<div v-if="timeout">
			<tab-bar>
				<tab-bar-item link="/Join">
					<img slot="item-img" src="./assets/img/com/join.svg">
					<img slot="item-img-active" src="./assets/img/com/join_active.svg">
					<div slot="item-text">纳新</div>
				</tab-bar-item>

				<tab-bar-item link="/Admin">
					<img slot="item-img" src="./assets/img/com/nickname.svg">
					<img slot="item-img-active" src="./assets/img/com/nickname_active.svg">
					<div slot="item-text">管理员</div>
				</tab-bar-item>
			</tab-bar>
		</div>
  </div>
</template>
<script>
	import TabBar from './components/TabBar.vue'
	import TabBarItem from './components/TabBarItem.vue'
	
	export default {
		name:'App',
		data(){
			return {
				timeout:false
			}
		},
		methods:{
			showBar(){
				setTimeout(() =>{
					this.timeout = true
				},2500)
			}
		},
		components:{
			TabBar,TabBarItem
		},
		created(){
			this.showBar()
		}
	}
	
</script>
<style>
	#nav{
		z-index: -1;
	}
</style>
